
import Utils from '../utils';
let __inited = false;

/**
 * HTML5模式的波形图。
 *
 * 基于Canvas绘制。
 */
class VolumeBar {
    /**
     * 绘制一个波形图。(如果已绘制过，不会再次绘制）。
     *
     * param {string} recorder_id - 要绘制在当前页面的DOM节点的ID。
     * param {AudioContext} audioCtx - 获取到的页面音频设备上下文。
     * param {Analysis} analyser - 获取到的页面音频数据解析器。
     * param {Object} mic - 获取到的页面音频麦克风设备。
     */
    constructor(recorder_id, audioCtx, analyser, mic) {
        this.__ele = Utils.find(document, recorder_id);
        this.__audioCtx = audioCtx;
        this.__analyser = analyser;
        this.__mic = mic;

        if (!this.__ele) return;

        if (!__inited) {
            __inited = true;

            this.__bar = document.createElement('canvas');
            this.__ele.appendChild(this.__bar);
        } else {
            this.__bar = Utils.find(this.__ele, 'canvas');
        }
    }

    /** 显示波形图 */
    show() {
        if (this.__shown) return;
        this.__shown = true;
        let mic = this.__mic;
        let analyser = this.__analyser;
        let audioCtx = this.__audioCtx;
        let cv = this.__bar;

        cv.width = this.__ele.width > 0 ? this.__ele.width : 175;
        cv.height = this.__ele.height > 0 ? this.__ele.height : 50;

        let ctx = cv.getContext('2d');
        let W = cv.width;
        let H = cv.height;
        let STEP = 1;
        let N = W / STEP;

        let energies = new Array();

        ctx.strokeStyle = "#6CA6CD";
        cv.border = 1;
        cv.style.backgroundColor = "#CBCBCB";

        let draw = () => {
            ctx.clearRect(0, 0, W, H);

            ctx.beginPath();
            ctx.moveTo(0.5, Math.floor(H * 0.9) + 0.5);
            ctx.lineTo(W - 0.5, Math.floor(H * 0.9) + 0.5);
            ctx.closePath();
            ctx.lineWidth = 1;
            ctx.strokeStyle = "rgba(255, 0, 0, 0.5)";
            ctx.stroke();

            ctx.strokeStyle = "#6CA6CD";
            let dataArray = new Uint8Array(analyser.frequencyBinCount);
            analyser.getByteFrequencyData(dataArray);

            for (let i = 0; i < analyser.frequencyBinCount; i += analyser.frequencyBinCount / 3) {
                if (energies.length >= N) energies.shift();
                energies.push(dataArray[i]);
            }

            ctx.beginPath();
            for (let j = 0; j < N; j++) {
                let energy = energies[j] * 1.2;
                ctx.moveTo(STEP * j, H);
                ctx.lineTo(STEP * j, H - H * energy / 256);
                ctx.stroke();
            }
            setTimeout(draw, 150);
        };
        draw();
    }
    /**
     * 获取频谱数据
     *  @return {array} - 频谱数据
     * */
    getFrequencyData(callback){
        let an = this.__analyser;
        let dataArray = null;
        let max = 0;
        let min = 0;
        let vol = 0;
        let dg = ()=>{
            try {
                dataArray = new Uint8Array(an.frequencyBinCount);
                an.getByteFrequencyData(dataArray);
            }catch (e) {
                console.error(e);
            }

            max = Math.max.apply(null,dataArray);
            min = Math.min.apply(null,dataArray);

            vol = (max - min) / 128;
            vol = Math.round( (vol * 100) / 2 );
            vol = vol > 100 ? 100 : vol;

            if (typeof callback === "function"){
                callback({ soundIntensity: vol })
            }
            setTimeout(dg, 167);
        };
        dg()
    }
}

export default VolumeBar;
